// 封装一个渲染学生成绩列表的函数
const getStudentScore = async () =>{
    const {data} = await axios.get('/score/list')
    console.log(data);
    // console.log(Object.keys(data.data));
    document.querySelector('tbody').innerHTML = Object.keys(data.data).map(item => {
        // console.log(item);
      return  `
            <tr>
                <th scope="row">${item}</th>
                <td>${data.data[item].name}</td>
                <td class="score" data-id=${item} data-batch=1>${data.data[item].score[0]}</td>
                <td class="score" data-id=${item} data-batch=2>${data.data[item].score[1]}</td>
                <td class="score" data-id=${item} data-batch=3>${data.data[item].score[2]}</td>
                <td class="score" data-id=${item} data-batch=4>${data.data[item].score[3]}</td>
                <td class="score" data-id=${item} data-batch=5>${data.data[item].score[4]}</td>
                </tr>
            `
    }).join('')
   
}
getStudentScore()
let id = ''
let batch = ''
// // 点击表格进行录入  利用事件委托
document.querySelector('tbody').addEventListener('click', function (e) {
    // 判断是否点击的是分数td
    if (e.target.classList.contains('score')) {
        const value = e.target.innerHTML
        id = e.target.dataset.id
        batch = e.target.dataset.batch
        // console.log(value);
        // 给当前点击的标签添加input输入框
        e.target.innerHTML = `<input type="text" value="${value}" class = 'inp' >`
    }
    
})

// // 添加键盘按下事件
document.querySelector('tbody').addEventListener('keydown', async function (e) {
    if (e.key == 'Enter') {
        const score = e.target.value
        const { data } = await axios.post('/score/entry', {
            "stu_id": id,
            "batch": batch,
            "score": score
        })
        console.log(data);
        Toast.success('修改成功')
    }
})



